import React, {Component} from "react";
import {
	View,
	Text,
	Image,
	StyleSheet,
	FlatList,
	ToastAndroid,
} from "react-native";
import {observer} from "mobx-react/native";

import CustomCard from "../components/CustomCard";
import UseAPI from "../models/useAPI";

@observer 
export default class CategoryWeibo extends Component {
	static navigationOptions = ({navigation}) => {
		return {
			title: `${navigation.state.params.title}`
		}
	}

	constructor(props) {
		super(props);
		this.state = {
			refreshing: false,
		}
	}

	componentDidMount() {
		const {state} = this.props.navigation;
		UseAPI.list = null;
		UseAPI.fetchWeibo(state.params.name);
	}

	_keyExtractor = (item, index) => {
		return item.num;
	}

	_renderWeiboItem = ({item, index}) => (
		<CustomCard
			source={{uri: item.img}}
			text={item.name}
			DateText={<Text style={{fontSize: gFontSize.three}}>影响指数：{item.influence}</Text>}
			ContentText={item.newinfo}
		/>
	)

	_refreshing = () => {
		const {state} = this.props.navigation;
	    //请求数据操作；
		UseAPI.fetchWeibo(state.params.name).then(() => {
			setTimeout(() => {
				//判断网络连接状况;
				global.freshNetwork();
			}, 10)
		});
	}
	render() {
		return (
			<View style={styles.container}>
				<FlatList 
					data={UseAPI.list}
					keyExtractor={this._keyExtractor}
					renderItem={this._renderWeiboItem}
					refreshing={this.state.refreshing}
					onRefresh={this._refreshing}
					ListEmptyComponent={<Text style={{alignSelf: "center", marginTop: 50,}}>正在努力为您加载中...</Text>}
					initialNumToRender={8}
				/>
			</View>
		);
	}
}
  
const styles = StyleSheet.create({
	container: {
		flex: 1,
		backgroundColor: gColor.bgColorTwo,
	}
})
